/**
 * Created by gengrong on 16/4/5.
 */
import {LayerLink,Panel} from 'comps/common';
import * as React from 'react';
import {Table,Button,Modal} from 'antd';
import TracingDetail from '../containers/tracing-detail';
import ServiceTracingEnableModal from './service-tracing-enable';
import {formatDateByMilliseconds} from 'utils'
import moment from 'moment';

const confirm = Modal.confirm;

class ServiceTracingList extends React.Component {

  constructor(props) {
    super(props);
    this.state = {
      selectedRowKeys: [],  // 这里配置默认勾选列
      loading: false
    }
  }

  onSelectChange(selectedRowKeys) {
    this.setState({ selectedRowKeys });
  }

  columns = [
    {
      title: '追踪ID',
      dataIndex: 'rootId',
      key: 'rootId',
      render(rootId, record){
        return <LayerLink component={TracingDetail}
          data={{serviceId:record.interfaceName,rootId:rootId}}>{rootId}</LayerLink>
      }
    }, {
      title: '方法名',
      dataIndex: 'methodName',
      key: 'methodName'
    }, {
      title: '执行时间',
      dataIndex: 'startTime',
      key: 'startTime',
      render: startTime => moment(startTime)
        .format('YYYY-MM-DD HH:mm:ss.SSSS')
    }, {
      title: '执行耗时',
      dataIndex: 'startTime',
      key: 'endTime',
      render(startTime, record){
        const runTime = record.endTime - startTime;
        return `${runTime} ms`;
      }
    }, {
      title: '执行状态',
      dataIndex: 'status',
      key: 'status',
      render(status) {
        return {
          OK: <span className="color-success">正常</span>,
          EXCEPTION: <span className="color-danger">异常</span>,
          TIME_OUT: <span className="color-warning">超时</span>
        }[status];
      }
    }, {
      title: '操作',
      key: 'operation',
      render() {
        return '管理';
      }
    }
  ]

  showServiceTracingEnableModal() {
    const model = this.refs.serviceTracingEnableModal;
    model.showModal()
  }

  deleteTracingRecord() {
    const {selectedRowKeys } = this.state;
    const {serviceId,deleteTracingRecord} = this.props;
    confirm({
      title: '您是否确认要删除该追踪记录?',
      content: '',
      onOk() {
        deleteTracingRecord(serviceId, selectedRowKeys)
      }
    });
  }

  render() {
    const {selectedRowKeys } = this.state;
    const rowSelection = {
      selectedRowKeys,
      onChange: ::this.onSelectChange,
    };
    const hasSelected = selectedRowKeys.length > 0;

    return (
      <div>
        <Panel title="追踪记录列表">

          <Button type="primary" size="small" onClick={::this.showServiceTracingEnableModal}>开启追踪</Button>

          <Button disabled={!hasSelected} size="small" onClick={::this.deleteTracingRecord}>批量删除</Button>

          <Table dataSource={this.props.tracingList} columns={this.columns} pagination={false} size="middle"
            rowSelection={rowSelection} rowKey={record => record.rootId}/>
        </Panel>
        <ServiceTracingEnableModal onSave={this.props.enableTracing} serviceId={this.props.serviceId}
          ref="serviceTracingEnableModal"/>
      </div>
    );
  }
}

export default ServiceTracingList;
